import React from 'react'
import {Col,Row,Button} from 'antd'
import { Input,Checkbox } from 'antd';
import { Select,Cascader, message } from 'antd';
import { DatePicker } from 'antd';
import './Add.css'
import axios from 'axios'
import {Link} from 'react-router-dom'
const info = () => {
    axios({
        url:'client/addClient',
        method:'post',
        data:{
             "clientAddress": "浙江杭州皮革老城",
             "clientCompany": "阿里巴巴",
              "clientLevelId": 1,
              "clientName": "马云",
              "clientTel": "138111",
              "deptId": "uuidasdasdadasdas",
              "password": "123456",
              "repositoryId": "uuiddasdasdadsadsad",
              "stateId": 0,
              "username": "hjk45555"
            },
            "fiance": {
                "accountMoney": 0,
                "accountName": "string",
                "acountMoney": 0,
                "address": "浙江杭州西湖",
                "bank": "string",
                "bankNumber": "string",
               "clientId": "string",
                "fianceMoneyCompany": "string",
                "fianceMoneyId": "string",
                "taxpayerNumber": "string",
                "tel": "string"
              }
    }).then(res=>{
        console.log(res)
    })
    message.info('请输入值');
};
const { RangePicker } = DatePicker;
const { Option } = Select;
const options = [
    {
        value: 'zhejiang',
        label: 'Zhejiang',
        children: [
            {
                value: 'hangzhou',
                label: 'Hangzhou',
                children: [
                    {
                        value: 'xihu',
                        label: 'West Lake',
                    },
                ],
            },
        ],
    },
    {
        value: 'jiangsu',
        label: 'Jiangsu',
        children: [
            {
                value: 'nanjing',
                label: 'Nanjing',
                children: [
                    {
                        value: 'zhonghuamen',
                        label: 'Zhong Hua Men',
                    },
                ],
            },
        ],
    },
];
function handleChange(value) {
    console.log(`selected ${value}`);
}
function onChange(value) {
    console.log(value);
}
function onChange1(e) {
    console.log(`checked = ${e.target.checked}`);
}
class Add extends React.Component {

    state={
        disabled :true,
    };

    toggle = () => {
        this.setState({
            disabled: !this.state.disabled,
        });
    };
    render() {
        return (
            <div>
                <Row style={{padding:'16px'}}>
                    <Col style={{color:'#03B8CC'}}>
                        公司信息
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col style={{marginLeft:'70px'}} span={1}>
                        <span style={{color:'red'}}>*</span>经销商名称
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Input style={{width:'350px'}}  />
                    </Col>
                    <Col style={{marginLeft:'70px'}} span={1}>
                        <span style={{color:'red'}}>*</span>经销商级别
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Select defaultValue="请选择" style={{ width: 350 }} onChange={handleChange}>
                            <Option value="代签代理">代签代理</Option>
                            <Option value="三级代理">三级代理</Option>
                            <Option value="二级代理">二级代理</Option>
                            <Option value="一级代理">一级代理</Option>
                            <Option value="新增级别">新增级别</Option>
                        </Select>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col style={{marginLeft:'70px'}} span={1}>
                        <span style={{color:'red'}}>*</span>经销商编码
                    </Col>
                    <Col  style={{paddingLeft:'10px'}}>
                        <Input style={{width:'350px'}}  />
                    </Col>
                    <Col style={{marginLeft:'65px'}}>
                        <span style={{color:'red'}}>*</span>默认发 <br/>货仓库
                    </Col>
                    <Col  style={{paddingLeft:'10px'}}>
                        <Select defaultValue="" style={{ width: 350 }} onChange={handleChange}>
                            <Option value="深圳">深圳仓</Option>
                            <Option value="上海">上海仓</Option>
                            <Option value="北京">北京仓</Option>
                        </Select>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col  style={{marginLeft:'50px'}}>
                        <span style={{color:'red'}}>*</span>
                        所在部门
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Select defaultValue="" style={{ width: 120}} onChange={handleChange}>
                            <Option value="深圳">深圳大区</Option>
                            <Option value="渠道">渠道销售部</Option>
                            <Option value="总部">总部区域</Option>
                        </Select>
                    </Col>
                    <Col  style={{marginLeft:'65px'}}>
                        业务员
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Select defaultValue="" style={{ width: 120}} onChange={handleChange}>

                        </Select>
                    </Col>
                    <Col style={{paddingLeft:'63px'}}>
                        推荐人
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Select defaultValue="" style={{ width: 150}} onChange={handleChange}>
                            <Option value="客户">客户</Option>
                            <Option value="员工">员工</Option>
                        </Select>
                    </Col>
                    <Col >
                        <Select defaultValue="" style={{ width: 215}} onChange={handleChange}>

                        </Select>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col style={{marginLeft:'55px'}}>
                        签约时间
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <RangePicker showTime />
                    </Col>
                    <Col style={{paddingLeft:'30px'}}>
                        邮编
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Input/>
                    </Col>
                    <Col>
                        传真
                    </Col>
                    <Col>
                        <Input/>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                   <Col  style={{marginLeft:'82px'}} >
                       区域
                   </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Cascader style={{width:'400px'}} options={options} onChange={onChange} />
                    </Col>
                    <Col style={{paddingLeft:'30px'}}>
                        详细地址
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col  style={{marginLeft:'54px'}} >
                       物流编码
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Input style={{width:'400px'}}/>
                    </Col>
                    <Col style={{paddingLeft:'30px'}}>
                       结算方式
                    </Col>
                    <Col style={{paddingLeft:'10px'}}>
                        <Select defaultValue="" style={{ width: 350 }} onChange={handleChange}>
                            <Option value="预付">预付</Option>
                            <Option value="现付">现付</Option>
                            <Option value="后付">后付</Option>
                        </Select>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col span ={24} style={{paddingLeft:'540px'}}>
                        <span>
                            备用信息
                        </span>
                        <span style={{marginLeft:'20px'}}><Input style={{width:'350px',height:'50px'}} /></span>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px',}}>
                    <Col style={{paddingLeft:'38px'}}>
                        经销商名称
                        <Input style={{width:'350px',marginLeft:'10px'}} />
                    </Col>
                </Row>
                <Row style={{padding:'16px',color:'#03B8CC'}}>
                    个人信息
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col style={{paddingLeft:'80px'}}>
                        <span style={{color:'red'}}>*</span>
                        <span>姓名</span>
                    </Col>
                    <Col>
                        <Input style={{width:'350px'}}/>
                    </Col>
                    <Col style={{paddingLeft:'100px'}} >
                        <span style={{color:'red'}}>*</span>
                        <span>手机</span>
                    </Col>
                    <Col>
                        <Input/>
                    </Col>
                    <Col>
                        <span>电话</span>
                    </Col>
                    <Col>
                        <Input/>
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}}>
                    <Col style={{paddingLeft:'80px'}}>
                        <span style={{color:'red'}}>*</span>
                        <span>职位</span>
                    </Col>
                    <Col>
                        <Input style={{width:'350px'}}/>
                    </Col>
                    <Col style={{paddingLeft:'100px'}} >
                        <span style={{color:'red'}}>*</span>
                        <span>email</span>
                    </Col>
                    <Col>
                        <Input/>
                    </Col>
                    <Col>
                        <span>QQ</span>
                    </Col>
                    <Col>
                        <Input/>
                    </Col>
                </Row>
                <Row style={{padding:'16px'}}>
                    <Col style={{color:'#03B8CC'}}>
                        账号信息
                    </Col>
                    <Col style={{paddingLeft:'5px'}}>
                        <Checkbox style={{color:"red"}} onChange={onChange1}  onClick={this.toggle}>开通订货账单</Checkbox>
                    </Col>
                    <Col style={{fontSize:'10px',paddingTop:'5px'}}>
                        （开通订货账号，经销商才能进入易订货系统订货）
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}} >
                    <Col style={{paddingLeft:'70px'}}>
                        账号
                    </Col>
                    <Col>
                        <Input disabled={this.state.disabled} style={{width:'370px'}}  />
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}} >
                    <Col style={{paddingLeft:'70px'}}>
                        密码
                    </Col>
                    <Col>
                        <Input  disabled={this.state.disabled} style={{width:'370px'}}  />
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}} >
                    <Col style={{paddingLeft:'40px'}}>
                        确认密码
                    </Col>
                    <Col>
                        <Input disabled={this.state.disabled} style={{width:'370px'}}  />
                    </Col>
                </Row>
                <Row style={{paddingBottom:'20px'}} >
                    <Col style={{paddingLeft:'96px'}}>
                        <Checkbox disabled={this.state.disabled} onChange={onChange1}>发送订货账号开通邮件</Checkbox>
                    </Col>
                    <Col>
                        <Checkbox disabled={this.state.disabled} onChange={onChange1}>发送订货账号开通短信</Checkbox>
                    </Col>
                </Row>
                <Row style={{padding:'16px',color:'#03B8CC'}}>
                    财务信息
                </Row>
                <Row style={{paddingBottom:'16px'}}>
                    <Col style={{paddingLeft:'68px'}}>地址</Col>
                    <Col><Input style={{width:'350px'}} /></Col>
                    <Col span={1} style={{marginLeft:'140px'}}>
                        电话
                    </Col>
                    <Col><Input style={{width:'310px'}} /></Col>
                </Row>
                <Row  style={{paddingBottom:'16px'}}>
                    <Col style={{paddingLeft:'40px'}}>开户名称</Col>
                    <Col><Input style={{width:'350px'}} /></Col>
                    <Col span={1} style={{marginLeft:'140px'}}>
                        开户银行
                    </Col>
                    <Col><Input style={{width:'310px'}} /></Col>
                </Row>
                <Row  style={{paddingBottom:'16px'}}>
                    <Col style={{paddingLeft:'40px'}}>银行账户</Col>
                    <Col><Input style={{width:'350px'}} /></Col>
                    <Col span={1} style={{marginLeft:'140px'}}>
                        账期类型
                    </Col>
                    <Col><Input style={{width:'310px'}} /></Col>
                </Row>
                <Row  style={{paddingBottom:'16px'}}>
                    <Col style={{paddingLeft:'40px'}}>发票抬头</Col>
                    <Col><Input style={{width:'350px'}} /></Col>
                    <Col span={1} style={{marginLeft:'140px'}}>
                        纳税人识别号
                    </Col>
                    <Col><Input style={{width:'310px'}} /></Col>
                </Row>
                <Row  style={{paddingBottom:'70px'}}>
                    <Col style={{paddingLeft:'10px'}}>上次对账日期</Col>
                    <Col><Input diasabled={true} style={{width:'350px'}} /></Col>
                    <Col span={1} style={{marginLeft:'140px'}}>
                        对账初始化
                    </Col>
                    <Col><Input diasabled={true} style={{width:'310px'}} /></Col>
                </Row>
                <Row className={'fixed'}>
                    <Col style={{paddingLeft:'500px'}} >
                       <Link to='/homepage/client'> <Button>取消</Button></Link>
                        <Button onClick={info} style={{marginLeft:'20px'}} type="primary">保存</Button>
                    </Col>
                </Row>
            </div>
        )
    }
}

export default Add